<!DOCTYPE html>
<html>

<head>
    @@include('../../tpl/res/js-head.tpl')
    <script type="text/javascript">
    $(document).ready(function() {
        var userLoginId = getUserLoginId();
        if (!userLoginId) {
            window.location.href = '../login/login-guide.html';
        }
    });
    </script>
    @@include('../../tpl/res/css.tpl',{ "title":"中国移动-10085微商城" })
    <link rel="stylesheet" href="../../assets/css/swiper.min.css">
    <link rel="stylesheet" href="../../assets/css/new.css">
    <style type="text/css" media="screen">
    #hot-porduct .lt-item:not(:first-of-type) {
        border-right-color: #fff;
    }
    /*手机系列弹框*/
    
    .phone-wrap {
        width: 70%;
        padding: 5%;
        position: absolute;
        background: #fff;
        top: 48px;
        right: 1000%;
        z-index: 1000;
        display: none;
    }
    
    .phone-wrap a {
        font-size: 0.8em;
        color: #666;
        display: inline-block;
        margin: 10px 5px;
    }
    
    .color-nc-box {
        height: auto;
        overflow: visible;
    }
    
    .pro-main-wrap {
        background: #fff;
        border-bottom: 1px solid #d3d3d3;
        margin-bottom: 10px;
    }
    
    .pro-info-wrap .num {
        padding-top: 5px;
    }
    
    .bespeak-tel .input-control {
        border: none;
        outline: none;
        -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
    }
    
    .tab-btn span.tab-orange {
        background-color: #f60;
        border: 1px solid #f60;
        color: #fff;
    }
    
    .disabled {
        background-color: #FFF;
        border: 1px solid #ededed;
        color: #d3d3d3
    }
    
    .mall_tip_m {
        background: rgba(0, 0, 0, 0.5);
        position: fixed;
        height: 100%;
        width: 100%;
        top: 0;
        z-index: 99;
        display: none;
    }
    
    .mall_tip {
        position: fixed;
        width: 80%;
        top: 30%;
        left: 50%;
        margin-left: -40%;
        border: solid 1px #dedede;
        border-radius: 4px;
        background: #fafafa;
        z-index: 999;
        box-shadow: 0 0 5px #6c6c6c;
    }
    
    .mall_tip div {
        text-align: center;
        border-bottom: solid 1px #dedede;
        padding: 5px 0;
        box-shadow: 0 5px 5px #ebebeb;
        line-height: 1.5em;
        font-size: 1em;
    }
    
    .mall_tip div img {
        vertical-align: middle;
        margin-top: -2px;
    }
    
    .mall_tip p {
        color: #666;
        font-size: 0.85em;
        padding: 0 20px 20px 20px;
        line-height: 1.5em;
        text-indent: 25px;
    }
    
    .mall_tip p.tipcolor {
        color: #333;
        font-size: 0.9em;
        padding: 20px 20px 5px 20px;
        text-indent: inherit;
    }
    
    .mall_tip a {
        display: block;
        border-top: solid 1px #dedede;
        text-align: center;
        padding: 5px 0;
        line-height: 1.5em;
        font-size: 0.9em;
    }
    
    .mui-control-content img {
        display: block;
    }
    /* 2016-3-21优化 */
    
    .pro-info-wrap .pro-img-box {
        border-radius: 4px;
    }
    
    .pro-info-wrap .pro-info .price {
        font-size: 14px;
    }
    
    .icon-cancel-circle {
        font-size: 1.4rem;
        color: #707070;
    }
    
    .pro-info-wrap .pro-info {
        color: #a0a0a0;
    }
    
    .tab-btn span {
        padding: 8px 10px;
    }
    
    .num-control-wrap input.num-show{
        width:40px !important;
        height:32px;
    }
    .num-control-wrap input.reduce{
        width:32px;
        height:32px;
    }
    .num-control-wrap input.num-add{
        width:32px;
        height:32px;
    }
    
    .c-service a {
        padding: 3px 5px;
    }
    
    .mui-control-item-inverse.active {
        color: #0c7dc1;
    }
    
    .c-service a {
        font-size: 0.6rem;
    }
    
    .c-list li {
        font-size: 0.875rem;
    }
    .icons-close{
        width:22px;
        height:22px;
    }
    .icons-close img{
        width:22px;
    }
    .product_img img{
        width:100% !important;
    }

    /*首页悬浮框*/
    .levitate{
        width:20%;
        height:15%;
        position: fixed;
        right:0px;
        top:50%;
        z-index: 999999;
    }
    .levitate img{
        width:100%;
    }
    .levitate span{
        width:1rem;
        height:1rem;
        position: absolute;
        top:0;
        right:0;
        display: block;
    }
    </style>
</head>

<body class="pdb50">
    <!-- 手机系列弹框 start -->
    <div class="phone-wrap">
    </div>
    <!-- 顶部 start -->
    <div class="g-top clearfix fn-psr">
        <!-- @@include('../../tpl/res/header-logo.tpl'}) -->
        <a href="../index/index.html" class="ui-logo  fn-lt">
            <span class="icons-logo"></span>
            <span>微商城</span>
        </a>
        <div class="m-search-wrap  fn-psr">
            <form id="J_search_form" class="m-search clearfix fn-rt index">
                <input type="text" id="J_search_input" class="ui-search fn-psa" placeholder="搜索商品名称或商家">
                <input type="button" id="J_search_btn" class="ui-search-btn icons-search fn-psa">
                <!-- 筛选 首页不要筛选按钮-->
                <a class="fn-rt s_cancel">取消</a>
                <!-- 删除输入 -->
                <span class="close-search icons-close-s fn-psa" id="J_clear_search"></span>
            </form>
        </div>
    </div>
    <!-- 顶部 end -->
    <!-- 轮播图 start -->
    <div class="swiper-container">
        <div class="swiper-wrapper" id="banner">
            <script id="swiper-wrapper" type="text/x-handlebars-template">
                {{#each beans}}
                <div class="swiper-slide">
                    <a href="{{TRGR_URL_ADDR}}"><img data-src="{{MAIN_PIC_SRC}}" alt="" class="swiper-lazy"></a>
                </div>
                {{/each}}
            </script>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>
    <!-- 轮播图 end -->
    <!-- 快捷导航 -->
    <div class="nav_speed">
        <ul>
            <li>
                <a href="../search/search-filter.html">
                    <span class="sp1"></span>
                    <p>手机</p>
                </a>
            </li>
            <li>
                <a href="../search/parts-search-filter.html">
                    <span class="sp2"></span>
                    <p>配件</p>
                </a>
            </li>
            <li>
                <a href="/index/province-preferential.html">
                    <span class="sp3"></span>
                    <p>本省优惠</p>
                </a>
            </li>
            <li>
                <a href="../search/buying.html">
                    <span class="sp6"></span>
                    <p>抢购</p>
                </a>
            </li>
            <!-- <li>
                <a href="#">
                    <span class="sp5"></span>
                    <p>买流量</p>
                </a>
            </li> -->
        </ul>
    </div>
    <!-- 推荐1区 start -->
    <div class="hot-porduct-wrap" id="hot-porduct">
        <script id="hot-porduct-wrap" type="text/x-handlebars-template">
            <div class="img-half-box lt-item">
                <div class="hot-img-wrap">
                    <a href="{{this.[0].TRGR_URL_ADDR}}">
                        <img src="{{this.[0].MAIN_PIC_SRC}}" alt="">
                    </a>
                </div>
            </div>
            <div class="img-half-box rt-item">
                <div class="hot-img-wrap">
                    <div class="rt-box-top">
                        <a href="{{this.[1].TRGR_URL_ADDR}}">
                            <img src="{{this.[1].MAIN_PIC_SRC}}" alt="">
                        </a>
                    </div>
                    <div class="rt-box-bottom">
                        <a href="{{this.[2].TRGR_URL_ADDR}}">
                            <img src="{{this.[2].MAIN_PIC_SRC}}" alt="">
                        </a>
                    </div>
                </div>
            </div>
        </script>
        <!--
        <div class="g-container-half rt-item fn-rt">
            <div class="g-container-full clearfix top-box">
                <a href="commodity-details.html">
                    <img src="../assets/img/mi2.jpg" alt="">
                </a>
            </div>
            <div class="g-container-full clearfix bottom-box">
                <a href="commodity-details.html">
                    <img src="../assets/img/mi3.jpg" alt="">
                </a>
            </div>
        </div>-->
    </div>
    <!-- 推荐1区 end -->
    <!-- 推荐2区 start -->
    <!-- <div class="hot-porduct-wrap bd-none" id="full-mtb"> -->
    <script id="g-container-full" type="text/x-handlebars-template">
        {{#each beans}}
        <!-- <div class="g-span3">
        <div class="hot-img-wrap">
          <a onclick="gotoArea('label','{{LBL_NM}}','{{LBL_ID}}')">
            <img src="{{PIC_STO_URL_ADDR}}" alt="">
          </a>
        </div>
      </div> -->
        {{/each}}
    </script>
    <!-- </div> -->
    
    <!-- 抢购专区 -->
    <div id="J_limit_area" class="g-container-full">
        <div  class="m-title m-titles clearfix">
            <h3 class="fn-lt" >抢购专区</h3>
            <a href="../search/buying.html" class="fn-rt"><span class="nav-icons icons-arrow_r"></span></a>
        </div>
        <div class="product_list_new">
            <ul id="J_limit_t_area_item_list">
                
            </ul>
        </div>
    </div>

    <!-- 推荐2区 end -->
    <div id="J_area_list" class="g-container-full">
        <script id="J_area_list_tpl" type="text/x-handlebars-template">
            {{#each this}}
            <div id="J_area_{{id}}" class="g-container-full mtb10" style="display:none;">
                {{#checkType name}}{{/checkType}}
                <h3 class="fn-lt" >{{name}}</h3>
                <a onclick="gotoArea('area','{{name}}','{{id}}')" class="fn-rt"><span class="nav-icons icons-arrow_r"></span></a>
            </div>
            <div class="product_list_new">
                <ul id="J_area_item_list_{{id}}" titleName="{{name}}">
                </ul>
            </div>
            <!-- 产品列表new -->
    </div>
    {{/each}}
    </script>
    </div>
    
    <!-- 专区列表填充 -->
    <script id="J_area_item_list_tpl" type="text/x-handlebars-template">
        {{#each beans}}
        <li>
            <div class="product_img">
                <a href="../commodity-details/commodity-details.html?productId={{MCDS_UNIT_ID}}" class="pro-link pro-list-item"><img src="{{MCDS_PIC_URL}}"></a>
            </div>
            <div class="product_info">
                <div class="pro_mean">
                    <h3><a href="../commodity-details/commodity-details.html?productId={{MCDS_UNIT_ID}}">{{MCDS_UNIT_NM}}</a></h3>
                    <b>￥{{UPRC}}</b>
                    <!-- <div>剩余{{SKU_QTY}}件<span><a href="javascript:;" class="buy_btn" onclick="openBuyDialog('{{MCDS_UNIT_ID}}')"><img src="../../assets/img/add.png"></a></span></div> -->
                    {{#numshowcompare SKU_QTY  200}}
					<div>货源充足<span><a href="javascript:;" class="buy_btn" onclick="openBuyDialog('{{MCDS_UNIT_ID}}')"><img src="../../assets/img/add.png"></a></span></div>
				    {{else}}
						{{#limitCompare SKU_QTY  '0'}}
							<div>无货<span><a href="javascript:;" class="buy_btn" onclick="openBuyDialog('{{MCDS_UNIT_ID}}')"><img src="../../assets/img/add.png"></a></span></div>
						{{else}}
							<div>剩余{{SKU_QTY}}件<span><a href="javascript:;" class="buy_btn" onclick="openBuyDialog('{{MCDS_UNIT_ID}}')"><img src="../../assets/img/add.png"></a></span></div>
						{{/limitCompare}}
					{{/numshowcompare}}
				</div>
            </div>
        </li>
        {{/each}}
    </script>
	
	<!-- 限时抢购产品填充 -->
	<script id="J_limit_t_area_item_list_tpl" type="text/x-handlebars-template">
	  {{#each beans}}
	    <li>
            <div class="product_img">
                <a href="../commodity-details/commodity-details.html?productId={{mcdsId}}" class="pro-link pro-list-item">
				<img src="{{mcdsPic}}"></a>
            </div>
            <div class="product_info">
                <div class="pro_mean">
                    <h3><a href="../commodity-details/commodity-details.html?productId={{mcdsId}}">{{mcdsNm}}</a></h3>
                    <b class="qg_price">￥{{uprc}}</b>
                     
                    <div>
					{{#limitCompare panicBuyState  '抢购中'}}
						{{#limitCompare skuQty  '0'}}
							<em class="">剩余时间：<em id="time_{{mcdsId}}"></em></em>
							<a class="qg_buy bt_disable" onclick="">已抢完</a>
						{{else}}
							<em class="">剩余时间：<em id="time_{{mcdsId}}"></em></em>
							<a class="qg_buy" onclick="validatePanicBuy('{{mcdsId}}','05')">立即抢购</a>
						{{/limitCompare}}
					{{else}}
					    <em class="">即将开始：
						<em id="time_{{mcdsId}}"></em></em>
                        <a class="qg_buy bt_disable" onclick="">即将开始</a>
					{{/limitCompare}}   
                    </div>
                </div>
            </div>
        </li>
	  {{/each}}
	</script>
	
	<!-- 限量秒杀产品填充 -->
	<script id="J_limit_n_area_item_list_tpl" type="text/x-handlebars-template">
	  {{#each beans}}
	   <li>
	    <div class="product_img">
            <a href="../commodity-details/commodity-details.html?productId={{mcdsId}}" class="pro-link pro-list-item">
			<img src="{{mcdsPic}}"></a>
        </div>
        <div class="product_info">
            <div class="pro_mean">
                <h3><a href="../commodity-details/commodity-details.html?productId={{mcdsId}}">{{mcdsNm}}</a></h3>
                
				
				{{#limitCompare panicBuyState '抢购中'}}
				   <b class="qg_price">￥{{uprc}}</b>
				{{else}}
				   <div>
                       <b class="qg_price">￥{{uprc}}</b>
                       <em class="sy_time">即将开始：
					   <em id="time_{{mcdsId}}"></em></em>
                   </div>
				{{/limitCompare}}
			   <div>
			   {{#limitCompare panicBuyState '抢购中'}}
				
				  
				   {{#limitCompare skuQty 0}}
				       <!--剩余数量：-->
				       <em class="surplus">无货</em>
                       <a class="qg_buy bt_disable" onclick="">已抢完</a>
				      
				   {{else}}
				        <!--剩余数量：
				       <em class="surplus">{{skuQty}}件</em> -->
					    {{#numshowcompare skuQty  200}}
							<em class="surplus">货源充足</em>
						{{else}}
							{{#limitCompare skuQty  '0'}}
								<em class="surplus">无货</em>
							{{else}}
								剩余数量：<em class="surplus">{{skuQty}}件</em>
							{{/limitCompare}}
						{{/numshowcompare}}
                       <a class="qg_buy" onclick="validatePanicBuy('{{mcdsId}}','06')">立即秒杀</a>
				   {{/limitCompare}}
				{{else}}
				   限量：
				   <em class="surplus">{{skuQty}}件</em>
                   <a class="qg_buy bt_disable" onclick="">即将开始</a>
				{{/limitCompare}}
                </div>
            </div>
        </div>
		</li>
		 {{/each}}
	</script>
	
    <!-- 购买弹框 -->
    <div class="g-container-full fn-psf buy-dialog" id="buy_hint">
        <div class="pro-main-wrap clearfix">
            <div class="pro-info-wrap clearfix">
                <div class="pro-img-box">
                    <script id="pro-img-box-list-tpl" type="text/x-handlebars-template">
                        <div class="img">
                            <img src="{{this}}" alt="">
                        </div>
                    </script>
                </div>
                <div class="pro-info">
                    <p class="price s-orange">
                        <span class="moneySign">￥</span><span class="J_pro_price"></span>
                    </p>
                    <p class="stock">
                    </p>
                    <div style="height:42px;">
                        <p id="J_select_tip" class="off-checked">
                        </p>
                    </div>
                    <span class="close icons-close" id="J_dialog_close"><img src="../../assets/img/close-b.png"></span>
                </div>
            </div>
            <div id="color-nc-box" class="color-nc-box">
                <div class="pro-info-wrap clearfix fn-psr">
                    <h4 class="info-title">机身颜色</h4>
                    <div class="tab-btn clearfix" id="J_sl_color"></div>
                </div>
                <div class="pro-info-wrap clearfix ">
                    <h4 class="info-title">机身内存</h4>
                    <div class="tab-btn clearfix" id="J_sl_nc"></div>
                </div>
                <div class="pro-info-wrap clearfix ">
                    <h4 class="info-title">版本</h4>
                    <div class="tab-btn clearfix" id="J_sl_vers">
                    </div>
                </div>
            </div>
            <!-- 购买数量 -->
            <div class="pro-info-wrap clearfix last" id="J_limit_form">
            </div>
        </div>
        <div class="g-container-full clearfix buy-btn-wrap" id="hint_btns">
            <a class="g-container-half add-shopping" id="J_add_shop_btn">
          加入购物车 </a>
            <a class="g-container-half buy" id="J_buy_now_btn">
          立即购买
        </a>
        </div>
    </div>
    <!-- 专区列表填充 -->
    <!-- 专区列表填充old -->
    <!-- <script id="J_area_item_list_tpl" type="text/x-handlebars-template">
    {{#each beans}}
    <li>
      <a href="../commodity-details/commodity-details.html?productId={{MCDS_UNIT_ID}}" class="pro-link pro-list-item">
      <div class="g-img-box">
        <img src="{{MCDS_PIC_URL}}" alt="">
      </div>
      <div class="pro-title">
        <p class="pro-name">{{MCDS_UNIT_NM}}</p>
        <p class="title-xl s-orange"><span class="moneySign">￥</span>{{UPRC}}</p>
      </div>
      </a>
    </li>
    {{/each}}
  </script> -->
    <!-- 专区列表填充old -->
    <!-- 返回顶部 -->
    <div id="scrollTop" class="icons-s-top"></div>
    <script id="J_limit_form_tpl" type="text/x-handlebars-template">
        <!--<h4 class="info-title fn-lt num">购买数量<span>（限购{{BUY_LIMIT_NUM}}台）</span></h4>-->
        <h4 class="info-title fn-lt num">购买数量：</h4> {{#if multiple}}
        <!-- 可购买多件 start -->
        <form action="" id="pro-num" class="num-control-wrap fn-rt clearfix">
            {{#compare SKU_QTY '!=' '0'}}
            <input type="button" class="reduce disabled num-reduce" id="J_num_reduce" value="-" disabled="disabled" />
            <input type="text" value="1" id="J_num_val" class="num-show" />
            <input type="button" class="add num-add" id="J_num_add" value="+" /> {{else}}
            <input type="button" class="reduce disabled num-reduce" id="J_num_reduce" value="-" disabled="disabled" />
            <input type="text" value="0" id="J_num_val" class="num-show disabled" disabled="disabled" />
            <input type="button" class="add num-add disabled" id="J_num_add" value="+" disabled="disabled" /> {{/compare}}
        </form>
        <!-- 可购买多件 end -->
        {{else}}
        <!-- 只能购买1件 start -->
        {{#compare SKU_QTY '!=' '0'}}
        <span class="pro-info fn-rt" style="padding-left:0">1 (当前商品每次仅支持购买1件)</span>
        <!--  <span class="pro-info fn-rt" style="padding-left:0">数量：1 (当前商品每次仅支持购买1件)</span>-->
        <input type="hidden" value="1" id="J_num_val" class="num-show" /> {{else}}
        <span class="pro-info fn-rt" style="padding-left:0">当前商品无货</span> {{/compare}}
        <!-- 只能购买1件 end -->
        {{/if}}
    </script>
    <!-- 首页悬浮框 -->
    <!-- <div class="levitate">
        <a href="../foseven/index.html"><img src="../../assets/img/517_wins.jpg"></a>
        <span></span>
    </div> -->

    @@include('../../tpl/res/js.tpl') @@include('../../tpl/res/footer-nav.tpl',{"current-bt-index":"1"})
    <script src="../../assets/lib/swiper.min.js"></script>
    <script src="../../js/index/index.js"></script>
    <script src="../../js/index/index-parts.js"></script>
    <!--父容器-->
    <script type="text/javascript">
    $(document).ready(function() {
        $(".s_cancel").click(function() {
            $(".ui-search").val("");
            $(".s_cancel").hide();
            $("#J_clear_search").hide();
        });
        $(".ui-search").click(function() {
            $(".s_cancel").show();
        });
        $(".close-search").click(function() {
            $(".s_cancel").hide();
        });
        // 首页悬浮框悬浮关闭
        $(".levitate span").click(function(){
            $(".levitate").hide();
        });
    });
    </script>
</body>

</html>
